<template>
    <div>
        <el-table :data="localTasks" size="mini" border :style="{ width: '100%', marginTop: '15px' }" row-key="id">
            <el-table-column prop="userName" label="执行人" width="100">
                <template slot-scope="scope">
                    <div>
                        {{ scope.row.receiveUserName }}
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="taskDeptName" label="所属部门" width="120"> </el-table-column>
            <el-table-column prop="taskContent" label="任务内容"> </el-table-column>
            <el-table-column prop="helpContent" label="辅助信息"> </el-table-column>
            <el-table-column prop="taskContent" label="任务状态" align="center" width="100">
                <template slot-scope="scope">
                    <el-tag type="warning" v-if="scope.row.status == 0" size="mini">待下发</el-tag>
                    <el-tag v-if="scope.row.status == 1" size="mini">未完成</el-tag>
                    <el-tag type="success" v-if="scope.row.status == 2" size="mini">已完成</el-tag>
                    <el-tag type="danger" v-if="scope.row.status == 3" size="mini">已终止</el-tag>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="100" align="center">
                <template slot-scope="scope">
                    <el-button type="text" size="mini" @click="handleDetail(scope.row)">任务详情</el-button>
                </template>
            </el-table-column>
        </el-table>
        <TaskDetail ref="taskDetail" />
    </div>
</template>

<script>
import * as HandleApi from "@/api/response/handle.js";
import TaskSubmitView from "@/views/components/taskSubmitView/index.vue";
import TaskDetail from "../components/HandleTaskDetail.vue";
export default {
    name: "HandleTaskTableView",
    components: { TaskSubmitView, TaskDetail },
    props: {
        tasks: {
            type: Array,
            default: [],
        },
        handleId: {
            type: Number,
            default: 0,
        },
        levelId: {
            type: Number,
            default: 0,
        },
        time: { type: Number, default: 1000 * 60 * 0.1 },
    },
    data() {
        return {
            timer: null,
            localTasks: [],
            taskId: 0,
        };
    },
    mounted() {
        if (this.tasks.length > 0) {
            this.localTasks = this.tasks;
        }
    },
    methods: {
        getTasks() {
            if (this.handleId != 0 && this.levelId != 0) {
                HandleApi.getHandleLevelTasks({
                    handleId: this.handleId,
                    levelId: this.levelId,
                }).then(res => {
                    this.localTasks = res.data;
                    this.$emit("refreshCurrentTasks");
                });
            }
        },
        handleStopTask(data) {
            // 删除或者取消任务
            this.$modal.loading(data.status == 1 ? "正在取消任务，请稍后..." : "正在删除任务，请稍后...");
            HandleApi.stopTask(data.id).then(res => {
                this.$modal.closeLoading();
                if (res.code == 200) {
                    this.$modal.msgSuccess(res.msg);
                } else {
                    this.$modal.msgError(res.msg);
                }
                this.$emit("refreshCurrentTasks");
            });
        },
        handleDetail(row) {
            this.$refs.taskDetail.showDialog(row);
        },
    },
    watch: {
        tasks(n, o) {
            this.localTasks = n;
        },
    },
};
</script>

<style lang="scss" scoped></style>
